<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    // 一般把函数当做参数来传给另外一个函数的时候使用箭头函数
    // setTimeout(
    //     function () {
    //         console.log(this)
    //     }
    //     , 1000) //打印window

    // setTimeout(() => console.log(this), 1000)//打印window


    const obj = {
        aaa() {
            // this=obj

            setTimeout(function () {
                // this = window

                setTimeout(function () {
                    // this 指向window
                    console.log(this)
                }),

                    setTimeout(() =>
                        // 本身没有this，所以会向外层寻找this。 this 指向window
                        console.log(this)
                    )

            })

            setTimeout(() => {


                // 本身没有this，所以会向外层寻找this。
                setTimeout(function () {
                    // this = window
                    console.log(this)
                })

                setTimeout(() =>
                    // 本身没有this，所以会向外层寻找this。
                    console.log(this)
                )

            })
        }
    }
    obj.aaa()
</script>
<script>
    var obj1 = {
        name: "孙悟空",
        sayHi: () => console.log(this, '1111'),
        sayHello: function () {
            // 隐含的this = obj1
            console.log(this, '1111')
        }
    }
    //这里为什么会输出 window
    // 因为对象不能形成一个作用域（我自己理解看来就是块级作用域），
    // 那么this就不是指向obj1这个对象，它会继续向外找具有作用域的模块，
    // 在当前案例下，this继续向外找找到了window，
    // 所以此时this为window
    // ====
    // this和箭头函数的值可以一言以蔽之：
    // 箭头函数：this等同于上一层非箭头的函数的this值或全局对象（window或undefined）
    // 普通函数this：谁调用归谁
    obj1.sayHi() //window

    obj1.sayHello()//obj
</script>

</html>
